{% extends "learn_django/base.html" %}
{% load staticfiles %}

{% block cutomer-script %}
    <script type="text/javascript">
        $(function(){ 
            $("#example1").DataTable(); 
        });
    </script>
{% endblock %}

{% block content %}
    <div class="content-wrapper">
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box">
                        <div class="box-header with-border">
                            <h3 class="box-title">用户列表</h3>
                        </div>
                        <!-- /.box-header -->
                        <div class="box-body">
                            <div class="table-contents">
                                <table id="example1" class="table table-bordered table-striped">
                                    <thead>
                                        <tr>
                                            <th>编号</th>
                                            <th>用户名</th>
                                            <th>邮箱</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% if all_users %}
                                            {% for user in all_users %}
                                                <tr>
                                                    <td>
                                                        <a href="{% url 'auth:udetail' user.id %}">
                                                            {{ user.id }}
                                                        </a>
                                                    </td>
                                                    <td>{{ user.username }}</td>
                                                    <td>{{ user.email }}</td>
                                                </tr>
                                            {% endfor %}
                                        {% endif %}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <!-- /.box-body -->
                    </div>
                    <!-- /.box -->
                </div>
                <!-- /.col -->
            </div>
            <!-- /.row -->
        </section>
    </div>
{% endblock %}